{extend name="base2" /}
{block name="style"}
<link rel="stylesheet" href="__CSS__/reset.css">
<link rel="stylesheet" href="__CSS__/base.css">
{/block}

{block name="body"}
    <div style="margin-top:5px;">
        <img src="/static/images/banner.jpg" alt="">
    </div>
<div class="contain">
    {foreach name="category_level_list" item="vo"}
        {eq name="$vo['pid']" value="0"}
            <h2>{$vo.name}</h2>

            <hr />

            <div id="masonry" class="container-fluid masonry">
                {foreach name="erjicategory_level_list" item="vm"}
                {if condition="$vm.pid eq $vo.id"}
                <div class="box">
                    <a href="{:url('wenan/wenan_detail',['id'=>$vm['id']])}">
                        <img src="{$vm.thumb ? $vm.thumb : '/static/images/default.png'}" alt="">
                        <h3 class="on">{$vm.name}</h3>
                    </a>
                </div>
                {/if}
                {/foreach}
            </div>
        {/eq}
    {/foreach}

</div><script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1261688529'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s4.cnzz.com/z_stat.php%3Fid%3D1261688529' type='text/javascript'%3E%3C/script%3E"));</script>
{/block}


{block name="script"}
<script>
    $(function() {
        var $container = $('.masonry');
        $container.imagesLoaded(function() {
            $container.masonry({
                itemSelector: '.box',
                gutter: 17,
                isAnimated: true,
                isFitWidth: true,
            });
        });
    });
</script>
{/block}